import { MailOutlined, CaretDownOutlined } from '@ant-design/icons';
import { Badge, Menu, Dropdown, Form, Input, Button, Modal } from 'antd';
import './index.less';
import React, { useState, useEffect } from 'react';
import { connect } from 'dva';
import { Link } from 'react-router-dom';
const Navigator = ({ children, dispatch }) => {
  const logout = () => {
    dispatch({
      type: 'auth/logout',
    });
  };
  const userInfo = JSON.parse(sessionStorage.getItem('userInfo') || '{}');
  const menu = (
    <Menu>
      <Menu.Item key="1">
        <Link to={{ pathname: '/user/password' }}>修改密码</Link>
      </Menu.Item>
      <Menu.Item key="2">
        <Link to={{ pathname: '/user/userInfo' }}>个人中心</Link>
      </Menu.Item>
      <Menu.Divider />
      <Menu.Item key="3" onClick={logout}>
        {' '}
        退出登录
      </Menu.Item>
    </Menu>
  );
  return (
    <div className="navigator">
      <div className="homeHeader">
        <div className="homeTitle">江津区信息化项目管理平台</div>
        <div className="homeOperate">
          {/* <Badge dot className="msgTip">
            <MailOutlined />
          </Badge>
          <div className="Yaxis"></div> */}
          <div>
            <Dropdown overlay={menu} className="userInfo">
              <a
                className="ant-dropdown-link"
                onClick={e => e.preventDefault()}
              >
                {userInfo.nickname || userInfo.realName} <CaretDownOutlined />
              </a>
            </Dropdown>
          </div>
        </div>
      </div>
    </div>
  );
};

export default connect(state => state.auth)(Navigator);
